<!-- 首页头部 -->
<template>
<div class='home-header'>
    <div class="header">
        <form action="">
                <input type="text" placeholder="搜素商品名称">
                <i class="iconfont icon-sousuo2"></i>
        </form>
        <a href="" class="iconfont icon-xiaoxi"></a>
    </div>
</div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

export default {
//import引入的组件需要注入到components对象中才能使用
components: {},
data() {
//这里存放数据
return {

};
},

}
</script>
<style lang="less">
    .home-header{
        width: 100%;
        height: 4.4rem;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999;
        // background-color: #f55;
        .header{
            display: flex;
            justify-content: space-between;
            form{
                width: 85%;
                position: relative;
                input{
                    border: none;
                    width: 100%;
                    height: 3rem;
                    margin-top: 0.7rem;
                    text-align: center;
                    border-radius: 1.5rem;
                    margin-left: 1rem;
                }
                i{
                    position: absolute;
                    width: 4.4rem;
                    height: 4.4rem;
                    line-height: 4.4rem;
                    text-align: center;
                    right: 0;
                    top: 0;
                    color: #999;
                    font-size: 1.8rem;
                }
            }
            a{
                width: 10%;
                display: block;
                line-height: 4.4rem;
                color: #fff;
                font-size: 2.2rem;
                text-align: center;

            }
        }
    }
</style>